import { Component, OnInit,Input } from '@angular/core';

@Component( {
    selector: 'countdown-timer',
    template: '<p>{{message}}</p>',
    styles: []
} )
export class CountdownTimerComponent implements OnInit {

    intervalId = 0;
    message = '';
    seconds = 11;
    @Input() hero:string;

    clearTimer() { clearInterval( this.intervalId ); }

    ngOnInit() { 
        this.start();
        console.log(this.hero);
    }
    ngOnDestroy() { this.clearTimer(); }

    start() { this.countDown(); }
    stop() {
        this.clearTimer();
        this.message = `Holding at T-${this.seconds} seconds`;
    }

    private countDown() {
        this.clearTimer();
        this.intervalId = +setInterval(() => {
            this.seconds -= 1;
            if ( this.seconds === 0 ) {
                this.message = 'Blast off!';
            } else {
                if ( this.seconds < 0 ) { this.seconds = 10; } // reset
                this.message = `T-${this.seconds} seconds and counting`;
            }
        }, 1000 );
    }

}
